<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>选择器</title>
    <link rel="stylesheet" href="./view/选择器/styles.css">
</head>
<body>
<!-- 选择器Unnamed (Rectangle) -->
<div id="u4619" class="ax_default heading_1">
    <div id="u4619_div" class=""></div>
    <div id="u4619_text" class="text ">
        <p><span>Select 选择器</span></p>
    </div>
</div>

<!-- Unnamed (Rectangle) -->
<div id="u4620" class="ax_default heading_1">
    <div id="u4620_div" class=""></div>
    <div id="u4620_text" class="text ">
        <p><span>概述</span></p>
    </div>
</div>

<!-- Unnamed (Rectangle) -->
<div id="u4621" class="ax_default label">
    <div id="u4621_div" class=""></div>
    <div id="u4621_text" class="text ">
        <p><span>使用模拟的增强下拉选择器来代替浏览器原生的选择器。</span></p><p><span>考虑到原型的用途无需数据代入，只实现了收起和展开的两种状态。</span></p>
    </div>
</div>

<!-- Unnamed (Group) -->
<div id="u4622" class="ax_default" data-left="230" data-top="335" data-width="212" data-height="32">

    <!-- select-list-1 (Group) -->
    <div id="u4623" class="ax_default ax_default_hidden" data-label="select-list-1" style="display:none; visibility: hidden" data-left="230" data-top="377" data-width="211" data-height="211">

        <!-- Unnamed (Rectangle) -->
        <div id="u4624" class="ax_default box_1">
            <div id="u4624_div" class=""></div>
            <div id="u4624_text" class="text " style="display:none; visibility: hidden">
                <p></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4625" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4625_div" class=""></div>
            <div id="u4625_text" class="text ">
                <p><span>New York</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4626" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4626_div" class=""></div>
            <div id="u4626_text" class="text ">
                <p><span>London</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4627" class="ax_default box_1 disabled" selectiongroup="dropdown-list-1">
            <div id="u4627_div" class="disabled"></div>
            <div id="u4627_text" class="text ">
                <p><span>Sydney</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4628" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4628_div" class=""></div>
            <div id="u4628_text" class="text ">
                <p><span>Ottawa</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4629" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4629_div" class=""></div>
            <div id="u4629_text" class="text ">
                <p><span>Paris</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4630" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4630_div" class=""></div>
            <div id="u4630_text" class="text ">
                <p><span>Canberra</span></p>
            </div>
        </div>
    </div>

    <!-- Unnamed (Group) -->
    <div id="u4631" class="ax_default" data-left="230" data-top="335" data-width="212" data-height="32">

        <!-- input-border (Rectangle) -->
        <div id="u4632" class="ax_default box_1" data-label="input-border">
            <div id="u4632_div" class=""></div>
            <div id="u4632_text" class="text ">
                <p><span>Choose</span></p>
            </div>
        </div>

        <!-- input-border (Rectangle) -->
        <div id="u4633" class="ax_default box_1" data-label="input-border">
            <img id="u4633_img" class="img " src="assets/images/选择器/input-border_u4633.svg"/>
            <div id="u4633_text" class="text ">
                <p><span></span></p>
            </div>
        </div>
    </div>
</div>

<!-- Unnamed (Group) -->
<div id="u4634" class="ax_default" data-left="479" data-top="335" data-width="212" data-height="32">

    <!-- select-list-2 (Group) -->
    <div id="u4635" class="ax_default ax_default_hidden" data-label="select-list-2" style="display:none; visibility: hidden" data-left="479" data-top="377" data-width="211" data-height="211">

        <!-- Unnamed (Rectangle) -->
        <div id="u4636" class="ax_default box_1">
            <div id="u4636_div" class=""></div>
            <div id="u4636_text" class="text " style="display:none; visibility: hidden">
                <p></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4637" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4637_div" class=""></div>
            <div id="u4637_text" class="text ">
                <p><span>New York</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4638" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4638_div" class=""></div>
            <div id="u4638_text" class="text ">
                <p><span>London</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4639" class="ax_default box_1 disabled" selectiongroup="dropdown-list-1">
            <div id="u4639_div" class="disabled"></div>
            <div id="u4639_text" class="text ">
                <p><span>Sydney</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4640" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4640_div" class=""></div>
            <div id="u4640_text" class="text ">
                <p><span>Ottawa</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4641" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4641_div" class=""></div>
            <div id="u4641_text" class="text ">
                <p><span>Paris</span></p>
            </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4642" class="ax_default box_1" selectiongroup="dropdown-list-1">
            <div id="u4642_div" class=""></div>
            <div id="u4642_text" class="text ">
                <p><span>Canberra</span></p>
            </div>
        </div>
    </div>

    <!-- Unnamed (Group) -->
    <div id="u4643" class="ax_default" data-left="479" data-top="335" data-width="212" data-height="32">

        <!-- input-border (Rectangle) -->
        <div id="u4644" class="ax_default box_1 disabled" data-label="input-border">
            <div id="u4644_div" class="disabled"></div>
            <div id="u4644_text" class="text ">
                <p><span>Choose</span></p>
            </div>
        </div>

        <!-- input-border (Rectangle) -->
        <div id="u4645" class="ax_default box_1 disabled" data-label="input-border">
            <img id="u4645_img" class="img " src="assets/images/选择器/input-border_u4633_disabled.svg"/>
            <div id="u4645_text" class="text ">
                <p><span></span></p>
            </div>
        </div>
    </div>
</div>

<!-- Unnamed (Rectangle) -->
<div id="u4646" class="ax_default label">
    <div id="u4646_div" class=""></div>
    <div id="u4646_text" class="text ">
        <p><span>&#149; 基础样式</span></p>
    </div>
</div>

<!-- Unnamed (Rectangle) -->
<div id="u4647" class="ax_default label">
    <div id="u4647_div" class=""></div>
    <div id="u4647_text" class="text ">
        <p><span>&#149; Disabled</span></p>
    </div>
</div>

<!-- Unnamed (Group) -->
<div id="u4648" class="ax_default" data-left="731" data-top="335" data-width="212" data-height="32">

    <!-- selection-group-3 (Group) -->
    <div id="u4649" class="ax_default ax_default_hidden" data-label="selection-group-3" style="display:none; visibility: hidden" data-left="731" data-top="377" data-width="211" data-height="211">

        <!-- Unnamed (Rectangle) -->
        <div id="u4650" class="ax_default box_1">
            <div id="u4650_div" class=""></div>
            <div id="u4650_text" class="text " style="display:none; visibility: hidden">
                <p></p>
            </div>
        </div>

        <!-- Unnamed (Group) -->
        <div id="u4651" class="ax_default" data-left="0" data-top="0" data-width="0" data-height="0">

            <!-- Unnamed (Rectangle) -->
            <div id="u4652" class="ax_default box_1">
                <div id="u4652_div" class=""></div>
                <div id="u4652_text" class="text ">
                    <p><span>New York</span></p>
                </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u4653" class="ax_default box_1">
                <img id="u4653_img" class="img " src="assets/images/选择器/u4653.svg"/>
                <div id="u4653_text" class="text ">
                    <p><span></span></p>
                </div>
            </div>
        </div>

        <!-- Unnamed (Group) -->
        <div id="u4654" class="ax_default" data-left="0" data-top="0" data-width="0" data-height="0">

            <!-- Unnamed (Rectangle) -->
            <div id="u4655" class="ax_default box_1">
                <div id="u4655_div" class=""></div>
                <div id="u4655_text" class="text ">
                    <p><span>London</span></p>
                </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u4656" class="ax_default box_1">
                <img id="u4656_img" class="img " src="assets/images/选择器/u4653.svg"/>
                <div id="u4656_text" class="text ">
                    <p><span></span></p>
                </div>
            </div>
        </div>

        <!-- Unnamed (Group) -->
        <div id="u4657" class="ax_default" data-left="0" data-top="0" data-width="0" data-height="0">

            <!-- Unnamed (Rectangle) -->
            <div id="u4658" class="ax_default box_1">
                <div id="u4658_div" class=""></div>
                <div id="u4658_text" class="text ">
                    <p><span>Sydney</span></p>
                </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u4659" class="ax_default box_1">
                <img id="u4659_img" class="img " src="assets/images/选择器/u4653.svg"/>
                <div id="u4659_text" class="text ">
                    <p><span></span></p>
                </div>
            </div>
        </div>

        <!-- Unnamed (Group) -->
        <div id="u4660" class="ax_default" data-left="0" data-top="0" data-width="0" data-height="0">

            <!-- Unnamed (Rectangle) -->
            <div id="u4661" class="ax_default box_1">
                <div id="u4661_div" class=""></div>
                <div id="u4661_text" class="text ">
                    <p><span>Ottawa</span></p>
                </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u4662" class="ax_default box_1">
                <img id="u4662_img" class="img " src="assets/images/选择器/u4653.svg"/>
                <div id="u4662_text" class="text ">
                    <p><span></span></p>
                </div>
            </div>
        </div>

        <!-- Unnamed (Group) -->
        <div id="u4663" class="ax_default" data-left="0" data-top="0" data-width="0" data-height="0">

            <!-- Unnamed (Rectangle) -->
            <div id="u4664" class="ax_default box_1">
                <div id="u4664_div" class=""></div>
                <div id="u4664_text" class="text ">
                    <p><span>Paris</span></p>
                </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u4665" class="ax_default box_1">
                <img id="u4665_img" class="img " src="assets/images/选择器/u4653.svg"/>
                <div id="u4665_text" class="text ">
                    <p><span></span></p>
                </div>
            </div>
        </div>

        <!-- Unnamed (Group) -->
        <div id="u4666" class="ax_default" data-left="0" data-top="0" data-width="0" data-height="0">

            <!-- Unnamed (Rectangle) -->
            <div id="u4667" class="ax_default box_1">
                <div id="u4667_div" class=""></div>
                <div id="u4667_text" class="text ">
                    <p><span>Canberra</span></p>
                </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u4668" class="ax_default box_1">
                <img id="u4668_img" class="img " src="assets/images/选择器/u4653.svg"/>
                <div id="u4668_text" class="text ">
                    <p><span></span></p>
                </div>
            </div>
        </div>
    </div>

    <!-- Unnamed (Group) -->
    <div id="u4669" class="ax_default" data-left="731" data-top="335" data-width="212" data-height="32">

        <!-- input-border (Rectangle) -->
        <div id="u4670" class="ax_default box_1" data-label="input-border">
            <div id="u4670_div" class=""></div>
            <div id="u4670_text" class="text ">
                <p><span>Multiple choose</span></p>
            </div>
        </div>

        <!-- input-border (Rectangle) -->
        <div id="u4671" class="ax_default box_1" data-label="input-border">
            <img id="u4671_img" class="img " src="assets/images/选择器/input-border_u4633.svg"/>
            <div id="u4671_text" class="text ">
                <p><span></span></p>
            </div>
        </div>
    </div>
</div>

<!-- Unnamed (Rectangle) -->
<div id="u4672" class="ax_default label">
    <div id="u4672_div" class=""></div>
    <div id="u4672_text" class="text ">
        <p><span>&#149; 多选</span></p>
    </div>
</div>
</body>
</html>
